<template>
  <t-dialog
    :header="header"
    :visible.sync="visible"
    :onClose="closeDialog"
    :closeOnOverlayClick="false"
    @confirm="uploadSuccess"
    width="80%"
    top="5%"
  >
    <t-alert style="margin-bottom: 14px" theme="info">
      <div slot="message">
        <p class="span-txt">
          确认提交后可以在申报详情-附件信息查看修改
        </p>
      </div>
    </t-alert>
    <t-table row-key="id" :columns="projectFileColumns" :data="projectFileData">
      <template #id="{row, rowIndex}">
        {{ rowIndex+1 }}
      </template>
      <template #c1="{row}">
        <a v-if="row.c3" class="t-button-link" :href="`${file_domain}/${row.c3}`" target="_blank">{{ row.c1 }}</a>
        <div v-else>{{row.c1}}</div>
      </template>
      <template #op="{row}">
        <div v-if="row.fileLists.length>0">
          <div v-for="(item,index) in row.fileLists" :key="index">
            <a class="t-button-link" target="_blank" :href="item.url" >
              {{item.name}}
            </a>
          </div>
        </div>
        <div v-else>
          <file-upload accept="application/pdf,image/*" v-model="row.fileIds"
                       :moduleKey="row.moduleKey"
                       :fileList="row.fileLists"
                       tips="限制pdf、图片"
                       :multiple="true">
            <t-button variant="outline">
              <t-icon name="cloud-upload" slot="icon"/>
              点击上传
            </t-button>
          </file-upload>
        </div>
      </template>
    </t-table>
  </t-dialog>
</template>

<script>
import { VITE_FILE_DOMAIN } from '@/api/upload'
import FileUpload from "@/components/FileUpload/index.vue"
import {getFiles} from "@/api/common";

export default {
  name: "project-file",
  components: {
    FileUpload
  },
  props: {
    objId: [String, Number],
    header: String,
  },
  data() {
    return {
      site_tag: import.meta.env.VITE_SITE_TAG,
      file_domain: VITE_FILE_DOMAIN,
      visible: true,
      projectFileColumns: [
        {
          colKey: "id",
          title: "序号",
          align: "center",
          width: 64
        },
        {
          colKey: "c1",
          title: "附件名称",
          align: "center",
        },
        {
          colKey: "c2",
          title: "是否必需",
          align: "center",
        },
        {
          colKey: "op",
          title: "附件列表",
          align: "left",
        },
      ],
      projectFileData: [
        {
          id: 1,
          c1: "查新报告",
          c2: "是",
          c3: "",
          moduleKey: "projectCXBG",
          fileIds: [],
          fileLists: [],
        },
        {
          id: 2,
          c1: "归口管理单位科研诚信承诺书(模版)",
          c2: "是",
          c3: "view/模板/归口管理单位科研诚信承诺书.pdf",
          fileIds: [],
          fileLists: [],
          moduleKey: "projectCNS"
        },
        {
          id: 3,
          c1: "项目组科研诚信承诺书(模版)",
          c2: "是",
          c3: "view/模板/项目组科研诚信承诺书.pdf",
          fileIds: [],
          fileLists: [],
          moduleKey: "projectTeamCNS"
        },
        {
          id: 4,
          c1: "已盖章申报书",
          c2: "审批通过之后，走完盖章流程后上传。",
          fileIds: [],
          fileLists: [],
          moduleKey: "projectSBS"
        }
      ],
    }
  },
  watch: {
    objId: {
      immediate: true,
      handler(val) {
        if (val) {
          this.getObj(val);
        }
      }
    },
  },
  methods: {
    getObj() {
      getFiles(this.objId).then((res) => {
        const files = {}
        res.data.forEach((item) => {
          if (!files[item.moduleKey]) {
            files[item.moduleKey] = []
          }
          files[item.moduleKey].push({
            name: item.fileName,
            url: item.fullFilePath,
            id: item.id,
            filePath: item.filePath
          })
        })
        this.projectFileData.forEach((val,index)=>{
          this.projectFileData[index].fileLists = files[val.moduleKey] || [];
          this.projectFileData[index].fileIds = files[val.moduleKey]?.map(val => val.id) || [];
        })
      }).catch((e) => {
        this.$message.error(e.toString());
      });
    },
    uploadSuccess(ids) {
      const sysAttMainIds = []
      this.projectFileData.forEach(val=>{
        sysAttMainIds.push(...val.fileIds)
      })
      this.$api.kjxm.project.edit({
        id: this.objId,
        sysAttMainVo: {
          sysAttMainIds
        }
      }).then(val => {
        this.$message.success("上传成功");
        this.$emit("reload");
        this.$emit("update:visible", false);
      }).catch((e) => {
        this.$message.error(e.toString());
      });
    },
    closeDialog() {
      this.$emit("update:visible", false);
    },
  }
}
</script>

<style scoped>

</style>
